<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="../../css/xterm.css"/>
</head>
<body>
<div id="terminal" style="width: 100%;height: 100%"></div>
<link rel="stylesheet" href="../../layui/css/layui.css">
<script src="../../layui/layui.js"></script>
<script src="../../js/jquery-3.4.1.min.js"></script>
<script src="../../js/xterm.js" charset="utf-8"></script>
<link rel="stylesheet" href="../../layui/custom/folder/iconfont.css">
<link rel="stylesheet" href="../../layui/custom/file/iconfont.css">
<script src="webssh.js" charset="utf-8"></script>

<script>
    let receive = window.opener["sshParams"];
    //获取接收到的数据
    let ip = receive["ip"];
    let username = receive["username"];
    let password = receive["password"];
    let port = receive["port"];
    let col = 195;
    // let row = 50;
    let row = 30;
    let wp = 1800;
    let hp = 1200;
    // let hp = 600;
    $("#pathName").val("/" + username)
    openTerminal({
        operate: 'connect',
        host: ip,//IP
        port: port,//端口
        username: username,//用户名
        password: password,//密码
        col: col,
        row: row,
        wp: wp,
        hp: hp,
    });

    function openTerminal(options) {
        var client = new WSSHClient();
        var term = new Terminal({
            cols: col, //输出屏幕长度设置
            rows: row,//输出屏幕高度设置
            cursorBlink: true, // 光标闪烁
            cursorStyle: "block", // 光标样式  null | 'block' | 'underline' | 'bar'
            scrollback: 800, //回滚
            tabStopWidth: 8, //制表宽度
            screenKeys: true
        });
        term.on('data', function (data) {
            //键盘输入时的回调函数
            client.sendClientData(data);
        });

        term.open(document.getElementById('terminal'));
        //在页面上显示连接中...
        term.write('Connecting...');
        //执行连接操作
        client.connect({
            onError: function (error) {
                //连接失败回调
                term.write('Error: ' + error + '\r\n');
            },
            onConnect: function () {
                //连接成功回调
                client.sendInitData(options);
            },
            onClose: function () {
                //连接关闭回调
                term.write("\rconnection closed");
            },
            onData: function (data) {
                //收到数据时回调
                term.write(data);
                console.log(data)
                judgeAndJump(data)
            }
        });
    }

    function judgeAndJump(data) {
        var re = ".*\\\x1B\\]0\\;(.+)@(.+):(.+)\\\x07\\[.*@.*\\]#.*";
        var group = data.match(re);
        if (group) {
            console.log("===================跳转路径为==================" + group[3]);
            if (group[3]) {
                checkPathIsTrue(group[3]);
            }
        }
    }

    function checkPathIsTrue(toPath) {
        const params = {
            path: toPath,
            ip: ip
        };
        $.ajax({
            url: '/server/checkPathIsTrue',
            data: JSON.stringify(params),
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            type: "post",
            success: function (result) {
                if (result.code == 0) {
                    // $("#pathName").focus();
                    $("#pathName").val(toPath)
                    // $("#pathName").blur();
                    search()
                }
            }
        })
    }

</script>
<script type="text/html" id="toolbarTable">
    <div class="layui-input-inline" style="margin-left: 30px;width: 400px">
        <input type="text" name="pathName" id="pathName" class="layui-input" placeholder="路径">
    </div>
    <div class="layui-input-inline" style="margin-left: 30px;width: 300px">
        <input type="text" name="name" id="name" class="layui-input" placeholder="搜索">
    </div>

    <div class="layui-input-inline" style="width: 700px">
        <button type="button" lay-event="refresh" id="refresh" class="layui-btn layui-btn-sm"><i
                class="layui-icon layui-icon-refresh">刷新</i></button>
        <button type="button" lay-event="up" id="up" class="layui-btn layui-btn-sm"><i class="layui-icon layui-icon-up">上级</i>
        </button>
        <button type="button" lay-event="uploadFile" id="uploadFile" class="layui-btn layui-btn-sm"><i
                class="layui-icon layui-icon-upload">上传</i></button>
        <button type="button" lay-event="download" id="download" class="layui-btn layui-btn-sm"><i
                class="layui-icon layui-icon-download-circle">下载</i></button>
        <button type="button" lay-event="add" id="add" class="layui-btn layui-btn-sm"><i
                class="layui-icon layui-icon-addition">新增</i></button>
        <button type="button" lay-event="del" id="del" class="layui-btn layui-btn-sm layui-btn-danger"><i
                class="layui-icon layui-icon-delete">删除</i></button>
    </div>
</script>
<table class="layui-hide" id="serverFile" lay-filter="serverFile"></table>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
</body>
</html>